import React from 'react'
import { connect } from 'dva'
import { Card, Table, Spin } from 'antd'
import moment from 'moment'

/**
 * StyleResearchList 
 */
import TheTable from '../../../components/TheTable'
class StyleResearchList extends React.Component {
    state = {
        data: this.props.styleResearchList,
    }
    componentDidMount() {
        this.fetchData(this.props)
    }
    componentWillReceiveProps(nextProps) {

        if ((nextProps.lPortId !== this.props.lPortId)) {
            this.fetchData(nextProps)
        }
        if (nextProps.styleResearchList !== this.props.styleResearchList) {
            this.setState({
                data: nextProps.styleResearchList,
            })
        }
    }
    fetchData = (props) => {
        this.setState({
            data: {}
        })
        props.dispatch({
            type: 'combinatorialAnalysis/getStyleResearchList',
            payload: props
        })
    }
    render() {
        const { field, list } = this.state.data
        const theFieldArr = ['产品ID', '产品名称', '数据类型', '数据状态', '开始日期', '截止日期', '数据频率']
        // 表头设置
        const columns = []
        if (field) {
            theFieldArr.map(item => {
                const theField = field.find(it => it.name === item)
                // if(theField.name==='数据状态'){
                //     columns.push({
                //         title: theField.name,
                //         dataIndex: theField.id,
                //         key: theField.id,
                //         render: (text, record) => <b style={{fontSize:18,color:text?'#7ED321':'#37A5FF'}}>●</b>
                //     })
                // }else{
                //     columns.push({
                //         title: theField.name,
                //         dataIndex: theField.id,
                //         key: theField.id,
                //         render: (text, record) => text||(text===0?0:'-')
                //     })
                // }
                if (theField.name === '数据状态') {
                    columns.push({
                        title: theField.name,
                        dataIndex: theField.id,
                        key: theField.id,
                        render: (text, record) => <b style={{ fontSize: 18, color: text ? '#7ED321' : '#37A5FF' }}>●</b>
                    })
                }
                else if (theField.name === '产品ID') {
                    columns.push({
                        title: theField.name,
                        dataIndex: theField.id,
                        key: theField.id,
                        render: (text, record, index) => {
                            if (index === 0) {
                                return {
                                    children: text || (text === 0 ? 0 : '-'),
                                    props: {
                                        rowSpan: 2,
                                    }
                                }
                            }
                            if (index === 1) {
                                return {
                                    props: {
                                        rowSpan: 0,
                                    }
                                }
                            }
                        }
                    })
                }
                else if (theField.name === '产品名称') {
                    columns.push({
                        title: theField.name,
                        dataIndex: theField.id,
                        key: theField.id,
                        render: (text, record, index) => {
                            if (index === 0) {
                                return {
                                    children: text || (text === 0 ? 0 : '-'),
                                    props: {
                                        rowSpan: 2,
                                    }
                                }
                            }
                            if (index === 1) {
                                return {
                                    props: {
                                        rowSpan: 0,
                                    }
                                }
                            }
                        }
                    })
                }
                else {
                    columns.push({
                        title: theField.name,
                        dataIndex: theField.id,
                        key: theField.id,
                        render: (text, record) => text || (text === 0 ? 0 : '-')
                    })
                }

            })
        }

        return (
            <Card title="产品基本信息" className="tableCard styleResearchList">
                {
                    Object.keys(this.state.data).length ? <TheTable columns={columns} dataSource={list} rowKey='id' pagination={this.state.data.list.length > 10 ? { size: "small" } : false} /> : <Spin />
                }
            </Card>
        )

    }
}

StyleResearchList.defaultProps = {
    lPortId: null,
    styleResearchList: {
        "field": [
            {
                "name": "产品ID",
                "id": "productID"
            },
            {
                "name": "产品名称",
                "id": "productName"
            },
            {
                "name": "数据类型",
                "id": "dataType"
            },
            {
                "name": "数据状态",
                "id": "dataState"
            },
            {
                "name": "开始日期",
                "id": "startDate"
            },
            {
                "name": "截止日期",
                "id": "closingDate"
            },
            {
                "name": "数据频率",
                "id": "dataFrequency"
            },
            {
                "name": "数据频率1",
                "id": "dataFrequency1"
            }
        ],
        "list": [
            {
                "id": 1,
                "productID": "GPDTSH0122",
                "productName": "股票多头1",
                "dataType": "净值",
                "dataState": 1,
                "startDate": "2017-03-01",
                "closingDate": "2018-03-27",
                "dataFrequency": "日",
                "dataFrequency1": "日",
            }
        ]
    }
}

export default connect()(StyleResearchList)
